<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>系统申请</title>
    <link rel="stylesheet" href="/public/static/css/style.min.css">
    <script type="text/javascript" src="/public/static/js/style.js"></script>
    <style type="text/css">
        .text {
            margin: 0 0.6rem;
        }

        .main .list .item .price {
            height: 1.6rem;
            line-height: 1.8rem;
            font-size: 0.6rem;
        }
    </style>
</head>

<body>
    <div class="text">
        <div class="title">系统简介</div>
        <p>亲，公众号版将提供更为强大的首页系统，不仅适用于自行定制广告的发布与管理，还能与其他公众号共享流量和用户。</p>
    </div>
    <div class="main">
        <div class="title">租赁手续费</div>
        <ul class="list clearfix">
            <li class="item" price="0">
                <div class="price">免费试用</div>
                <div class="time">租期：1天</div>
            </li>
            <li class="item" price="2">
                <div class="price">2元</div>
                <div class="time">租期：3天</div>
            </li>
            <li class="item" price="4">
                <div class="price">4元</div>
                <div class="time">租期：7天</div>
            </li>
            <li class="item" price="10">
                <div class="price">10元</div>
                <div class="time">租期：30天</div>
            </li>
            <li class="item current" price="25">
                <div class="price">25元</div>
                <div class="time">租期：180天</div>
            </li>
            <li class="item" price="40">
                <div class="price">40元</div>
                <div class="time">租期：360天</div>
            </li>
        </ul>
        <p class="user">勾选你想要的租赁服务时间
            <br>付费后，将自动获得公众号版的管理账号和密码</p>
        <div class="btn success">
            <a href="javascript:;" onclick="pay()">确定</a>
        </div>
    </div>
    <script type="text/javascript" src="/public/static/js/jquery.min.js"></script>
    <script type="text/javascript" src="/public/static/layer/layer.js"></script>
    <script>
        var jsApiParameters;
        $('.item').click(function () {
            $(this).addClass('current').siblings().removeClass('current');
        });

        function pay() {
            var price = $('.current').attr('price');
            if (price > 0) {
                $.ajax({
                    url: '{:url("pay/wxPayCallBack")}',
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        price: price,
                        act_id: Number('{:input("act_id")}'),
                        user_id: Number('{:input("uid")}'),
                    },
                    success: function (data) {
                        if (data) {
                            jsApiParameters = data;
                            callpay();
                        }
                    },
                    error: function () {
                        layer.open({
                            content: "网络错误!",
                            skin: 'msg',
                            time: 2,
                        });
                    }
                })
            } else {
                $.ajax({
                    url: '{:url("pay/tryout")}',
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        act_id: Number('{:input("act_id")}')
                    },
                    success: function (data) {
                        layer.open({
                            content: data.msg,
                            skin: 'msg',
                            time: 2,
                            end: function () {
                                // location.href = "/index/index/activitylist.html";
                                windous.history.back();
                            }
                        });

                    },
                    error: function () {
                        layer.open({
                            content: "网络错误!",
                            skin: 'msg',
                            time: 2,
                        });
                    }
                })
            }
        }
        //调用微信JS api 支付
        function jsApiCall() {
            WeixinJSBridge.invoke(
                'getBrandWCPayRequest', JSON.parse(jsApiParameters),
                function (res) {
                    if (res.err_msg == "get_brand_wcpay_request:ok") {
                        layer.open({
                            content: "支付成功",
                            skin: 'msg',
                            time: 2,
                            end: function () {
                                // location.href = "/index/index/activitylist.html";
                                windous.history.back();
                            }
                        });
                    } else {
                        layer.open({
                            content: "支付失败",
                            skin: 'msg',
                            time: 2,
                        });
                    }
                }
            );
        }

        function callpay() {
            if (typeof WeixinJSBridge == "undefined") {
                if (document.addEventListener) {
                    document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
                } else if (document.attachEvent) {
                    document.attachEvent('WeixinJSBridgeReady', jsApiCall);
                    document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
                }
            } else {
                jsApiCall();
            }
        }
    </script>
</body>

</html>